<template>
  <view class="" @touchstart="handstart" @touchend="handend">
    <slot></slot>
  </view>
</template>

<script>
export default {
  name: "",
  components: {},
  data() {
    return {
      starTime: 0,
      endTime: 0,
      startx: 0,
      starty: 0,
      endx: 0,
      endy: 0,
    };
  },

  methods: {
    handstart(e) {
      this.starTime = Date.now();
      this.startx = e.changedTouches[0].clientX;
      this.starty = e.changedTouches[0].clientY;
    },
    handend(e) {
      let dir = "";
      this.endTime = Date.now();
      this.endx = e.changedTouches[0].clientX;
      this.endy = e.changedTouches[0].clientY;
      if (
        Math.abs(this.endx - this.startx) > 10 &&
        Math.abs(this.endy - this.starty) < 10
      ) {
        dir = this.endx - this.startx > 0 ? "right" : "left";
        this.$emit("logdir", dir);
      }
    },
  },
};
</script>
<style lang="scss" scoped></style>
